<!--
 * @Author: 赵天利 5450026+zhaotianli01@user.noreply.gitee.com
 * @Date: 2023-12-26 10:42:21
 * @LastEditors: 赵天利 5450026+zhaotianli01@user.noreply.gitee.com
 * @LastEditTime: 2024-01-06 16:50:44
 * @FilePath: \BZ_JT_AnQuanHuanBaoGuanLiApp\src\views\staging\safety\safeProduction\details.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="common-details">
    <customDetailsTopbar flag :title="`${active}详情页`" @back="back" />
    <div class="infoWarp listInner px-1">
      <component :is="currentComponent" :company-id="companyId" />
    </div>
  </div>
</template>
<script>
import inputDetail from './components/basic.vue'
import costDetail from './components/cost.vue'
export default {
  components: {
    inputDetail,
    costDetail
  },
  data() {
    return {
      currentComponent: '',
      list: [
        {
          key: '年度投入费用使用',
          value: 'inputDetail'
        },
        {
          key: '月度投入费用使用',
          value: 'costDetail'
        }
      ],
      companyId: '',
      current: '',
      active: ''
    }
  },
  created() {
    const { current, companyId, active } = this.$route.query
    this.companyId = companyId || ''
    this.current = current || ''
    this.active = active || ''
  },
  mounted() {
    this.list = this.list.find((v) => {
      return v.key.indexOf(this.active) > -1
    })
    this.currentComponent = this.list.value
  },
  methods: {
    back() {
      this.$router.replace({
        path: '/staging/safeProduction',
        query: { current: this.current, active: this.active }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.infoWarp {
  position: absolute;
  top: 90px;
  right: 0;
  left: 0;
  bottom: 0;
  overflow-y: auto;
}
</style>
